/**
 * 文档作者: wj
 * 创建时间：2018年05月20日
 * 修改时间：2018年05月20日
 * 描述信息：评论列表
 */
import React, {Component} from 'react';
import './comment.scss';

class Comment extends Component {
    render() {
        return <div className='comment-component'>
            {
                this.props.data && this.props.data.map(value => {
                    const star = this.getStar(value.cmtStar);
                    return <div className='comment' key={value.cmtStar}>
                    <div className='ratings both-left-center'>
                        {star.map((val, index) => {
                            return <img key={index} 
                                className='star'
                                alt='star' 
                                src={require(`../../../assets/img/${val === 2 ? 'star' : val === 0 ? 'no_star' : 'half_star'}.png`)} />
                        })}
                        <span className='user-name'>{value.uid_name}</span>
                    </div>
                    <p className='reviews'>评语</p>
                    <p>{value.cmtStr}</p>
                    </div>
                })
            }
        </div>
    }

    /**
     * 计算star
     * @param {Number} value star数
     * @return {Array} 0: 没星 - 1:半星 - 2:满星
     */
    getStar(value) {
        let star = [];
        if (String(value).indexOf('.5') !== -1) {
            star = new Array(Number(String(value).replace('.5', ''))).fill(2);
            star.push(1);
        } else {
            star = new Array(Math.round(value)).fill(2);
        }
        const addStar = function() {
            if (star.length < 5) {
                star.push(0);
                addStar();
            }
        }
        addStar();
        return star;
    }
}

export default Comment;



